<template>
  <section class='f-rich-text'>
    <div v-if="messageContent" v-html="messageContent"></div>

    <div v-if="name == '订单消息'">
      <p style="margin:10px;font-size:14px">{{formData.title}}</p>
      <van-cell title="订单ID" :value="formData.orderId" />
      <van-cell title="销售渠道" :value="formData.thirdType" />
      <van-cell title="外部订单号" :value="formData.thirdOrderId || '--'" />
      <van-cell title="消息类型" :value="messageType[formData.messageType]" />
      <van-cell title="创建时间" :value="getDateTime(formData.createTime)[6]" />
    </div>

    <div v-if="name == '商品消息'">
      <p style="margin:10px;font-size:14px">{{formData.title}}</p>
      <van-cell title="商品名称" :value="formData.goodsName" />
      <van-cell title="商品描述" :value="formData.describe" />
      <van-cell title="消息来源" :value="formData.createShopName" />
      <van-cell title="消息类型" :value="messageType[formData.messageType]" />
      <van-cell title="创建时间" :value="getDateTime(formData.createTime)[6]" />
    </div>
  </section>
</template>
<script>
import { ref, reactive, toRefs, onMounted, watch } from 'vue';
import { useRouter, useRoute } from 'vue-router'
import { useStore } from 'vuex';
import { getDateTime, getStore } from '@/utils/utils';
import api from './api'

export default {
  setup(props, context) {
    const store = useStore()

    const router = useRouter()
    const route = useRoute();

    const state = reactive({
      name: "",
      formData: {},
      messageContent: getStore('Message_Content').content,

      messageType: {
        "10": "新商品上架",
        "11": "商品上架",
        "12": "商品下架",
        "13": "商品解冻",
        "14": "商品冻结",
        "20": "销售订单",
        "21": "生产订单",
        "23": "佣金订单",
        "24": "提现订单",
        "31": "系统全部消息",
        "32": "系统指定消息",
        "41": "号卡新商品上架",
      },

    })

    onMounted(() => {
      state.name = route.query.name
      state.formData = JSON.parse(route.query.queryData)
      console.log(state.formData)
      setMessageRead(route.query.messageId)
    })

    const setMessageRead = (messageId) => {
      let json = {
        messageId
      }
      api.messageRead(json).then(res => {

      })
    }

    return {
      ...toRefs(state),
      getDateTime
    }
  }
}
</script>
<style lang='scss'>
.f-rich-text {
  img {
    max-width: 100% !important;
  }
}
</style>